<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org/thymeleaf/layout"
      layout:decorator="layout" ng-app="app">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <style>
        .c-container{
            margin-top: 20px;
        }
        .c-input-inline{
            width: 470px!important;
        }
        .input-width{
            width: 460px;
        }
    </style>
</head>
<body>
<script src="../layui/layui.js"></script>
<script>

    layui.use(['layer', 'form'], function(){
        var layer = layui.layer
            ,form = layui.form;



    });
    function request(method,url,data, success){
        var loading = layer.load(0, {
            shade: false,
            time: 60*1000
        });
        layui.$.ajax({
            //添加请求头
            headers: {
//                'Token': $.cookie("token"),
                "Content-Type": "application/json;charset=UTF-8"
            },
            url:url,
            dataType: "json", //数据格式
            data: JSON.stringify(data),
            type: method,
            beforeSend:function () {
            },
            success:function(data){
//                layer.close(loading);
                if(success){
                    success(data)
                }
            },
            complete: function () {

                layer.close(loading);
            },
            error: function () {
                //请求出错处理
                layer.alert('系统繁忙，请稍后', {
                    icon: 5,
                    title: "提示"
                });
            }
        });
    }

    /**
     * 发送post请求
     * @param {发送请求路径} url
     * @param {JSON数据} data
     * @param {发送成功回调函数} success
     */
    function apiPost(url, data, success) {
        request('post', url, data, function (res) {
            return success(res);
        });
    }

    /**
     * 发送GET请求
     * @param {发送请求路径} url
     * @param {JSON数据} data
     * @param {发送成功回调函数} success
     */
    function apiGet(url, data, success) {
        request('get', url, data, function (res) {
            return success(res);
        });
    }

</script>
<div class="layui-container c-container">
    <div class="layui-row">
        <!--<div class="layui-col-md9">-->
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">excel文件夹</label>
                    <div class="layui-input-inline c-input-inline">
                        <input type="text" name="srcPath" required value="E:\cdm\excel" lay-verify="required" placeholder="E:\cdm\excel" autocomplete="off" class="layui-input input-width">
                    </div>
                    <div class="layui-form-mid layui-word-aux">只需要设置excel的文件夹路径</div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">sqlite文件</label>
                    <div class="layui-input-inline c-input-inline">
                        <input type="text" name="desPath" required value="E:\cdm\cdm.ydb" lay-verify="required" placeholder="E:\cdm\cdm.ydb" autocomplete="off" class="layui-input input-width">
                    </div>
                    <div class="layui-form-mid layui-word-aux">生成的sqlite路径或者具体文件路径</div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn" lay-submit lay-filter="formDemo">立即转换</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        <!--</div>-->
    </div>
</div>

<script>
    //Demo
    layui.use('form', function(){
        var form = layui.form;

        //监听提交
        form.on('submit(formDemo)', function(data){
//            layer.msg("------"+JSON.stringify(data.field));
            apiPost('/convert',data.field,function(res){
                console.log("--------",res)
                if(res && res.code == 0){
                    layer.msg('操作成功');
                }else{
                    layer.msg('操作失败'+res.msg);
                }
            })
            return false;
        });
    });
</script>

</body>
</html>